<template>
	<view>
		<u-card padding="16" v-for="(item,index) in dataList" :key="index">
			<view class="" slot="head">
				<view class="wrap">
					<u-row>
						<u-col span="9" text-align="left">
							<view class="weikaishi2">
								<span>{{item.diskName}}</span>
							</view>
						</u-col>
						<u-col span="3" text-align="right">
							<view class="weikaishi3" v-if="item.status == '未开始'">
								<span>{{item.status}}</span>
							</view>
							<view class="weikaishi3 jinxingzhong" v-if="item.status == '进行中'">
								<span>{{item.status}}</span>
							</view>
							<view class="weikaishi3 yiwancheng" v-if="item.status == '已结束'">
								<span>{{item.status}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="8" text-align="center">
							<view class="u-line-1 weikaishi2 lanse">
								<span v-html="item.speed+'%'"></span>
							</view>
						</u-col>
						<u-col span="4">
							<view class="u-line-1">
								<u-button type="primary" size="mini" @click="toHistory(item.id)">盘库详情</u-button>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12" text-align="center">
							<view class="u-line-1">
								<u-line-progress :striped="true" :percent="item.speed" :striped-active="true"></u-line-progress>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
			<view class="" slot="body">
				<view class="wrap">
					<u-row>
						<u-col span="6">
							<view class="weikaishi4 u-m-t-4">
								<span>仓库：{{item.warehouseName}}</span>
							</view>
						</u-col>
						<u-col span="6">
							<view class="weikaishi4 u-m-t-4">
								<span>类型：{{item.diskType}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>开盘总库存：{{item.countNum}}</span>
							</view>
						</u-col>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>开盘总体积：{{item.countVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>已盘数量：{{item.alreadyNum}}</span>
							</view>
						</u-col>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>已盘体积：{{item.alreadyVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>创建时间：{{item.createTime}}</span>
							</view>
						</u-col>
						<u-col span="6">
							<view class="weikaishi6 u-m-t-4">
								<span>创建用户：{{item.createUserName}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12">
							<view class="weikaishi6 u-m-t-4">
								<span>计划时间：{{item.jihuaTime}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row v-if="item.status == '进行中'">
						<u-col span="12" text-align="right">
							<view class="u-m-t-10 u-line-1">
								<span><u-button type="default" plain="true" size="default" @click="topandian(item.id)">盘点列表</u-button></span>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
		</u-card>
		<view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList:[],
				pageNo: 1,
				hasMore: true,
				orderCount: 0,
			};
		},
		onLoad() {
		},
		onShow() {
			this.refresh()
		},
		onPullDownRefresh() {
			this.refresh()
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			uni.showLoading({
				title: '加载中'
			})
			if (this.hasMore) {
				this.pageNo++ 
				setTimeout(() => {
					this.loadOrder({
						condition: this.keyword
					}).then(res => {})
					uni.hideLoading()
				}, 500)
			} else {
				setTimeout(() => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '已经到低了哦',
						duration: 2000
					});
				}, 500)
			}
		},
		methods: {
			toHistory(id){
				this.$Router.push({ 
					name: 'pandianlist_query',
					params: {diskId:id},
				})
			},
			topandian(id){
				this.$Router.push({ 
					name: 'pandianlist',
					params: {diskId:id},
				})
			},
			refresh(){
				this.pageNo = 1
				this.hasMore = true
				this.loadOrder({
				}).then(res => {
				})
			},
			loadOrder(param = {}) {
				return new Promise((resolve, reject) => {
					param = Object.assign(param, {
						page: this.pageNo,
						limit: 10
					})
					this.$http.post('/rest/PanDian/list',{
					},{
						params: param,
						header: {
							'Authorization' :uni.getStorageSync('token'),
						}
					}).then(res => {
						if (this.pageNo == 1) {
							this.dataList = res.data.data
						} else {
							this.dataList = this.dataList.concat(res.data.data)
						}
						this.orderCount = res.data.count
						this.hasMore = this.pageNo * 10 < res.data.count
						resolve(res)
					})
				})
			},
		}
	};
</script>
<style lang="scss">
	
	.u-body-item {
		padding: 20rpx 15rpx;
	}
	.wrap {
		padding: 10rpx;
	}

	.u-row {
		margin: 10rpx 2rpx;
	}
</style>